<div class="col-md-12">
  <%= render partial: 'details', locals: { scan: @scan } %>

  <div class="card card-outline-secondary text-xs-center">
    <div class="card-block">
      <div id="spinner" style="display: none;">
        <%= image_tag 'spinner.svg' %>
      </div>
      <table class="table">
        <thead>
          <tr>
            <th>#</th>
            <th>Type</th>
            <th>Description</th>
            <th>Parameter</th>
            <th>Details</th>
          </tr>
        </thead>
        <tbody>
          <% @vulnerabilities.each_with_index do |vulnerability, index| %>
            <% if vulnerability.class_type == 'Vulnerability' %>
              <tr class="<%= tr_class(vulnerability.status) %>">
                <td><%= index + 1 %></td>
                <td>
                  <b><span class="tag <%= badge(vulnerability.status) %>">
                    <%= vulnerability.status %>
                  </span></b>
                </td>
                <td><%= vulnerability.description %></td>
                <td><%= vulnerability.parameter %></td>
                <td><%= vulnerability.value %></td>
              </tr>
            <% end %>
          <% end %>
        </tbody>
      </table>
    </div>
  </div>
</div>

<%= javascript_tag do %>
  <% if @scan.status == 'processing' %>
    function fetch_scan() {
      $.ajax({
        url: '/scans/' + sid + '.json',
        method: 'GET',
        beforeSend: function() {
          $('#spinner').show();
        },
        success: function(data) {
          var status = data['scan']['status'];
          if (status == 'completed') {
            location.reload();
          }
        }
      });
    }
    var sid = $('#vulnerability-container').data('scan');
    setInterval(fetch_scan, 3000);
  <% end %>
<% end %>
